- // https://github.com/sindresorhus/pretty-bytes
- var prettyBytes = function( num ) {
-   var exponent;
-   var unit;
-   var neg = num < 0;
-   var units = ['B', 'kB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];
-
-   if (neg) {
-   	num = -num;
-   }
-
-   if (num < 1) {
-   	return (neg ? '-' : '') + num + ' B';
-   }
-
-   exponent = Math.min(Math.floor(Math.log(num) / Math.log(1000)), units.length - 1);
-   num = Number((num / Math.pow(1000, exponent)).toFixed(2));
-   unit = units[exponent];
-
-   return (neg ? '-' : '') + num + ' ' + unit;
- }

mixin tableData(data, prev)
	- var change = prev ? ( data - prev ) : 0;
	- var sign = change > 0 ? "+" : change < 0 ? "-" : "";
	if data
		td
			| #{data.toLocaleString()}&nbsp;
			span bytes<br/>(#{prettyBytes( data )})
			i(class="#{ change > 0	 ? 'decrease' : 'increase'}") Δ #{ sign }#{ prettyBytes(Math.abs(change)) }
	else
		td
			&ndash;

doctype
html.no-js
	head
		meta(charset='utf-8')
		meta(http-equiv='X-UA-Compatible', content='IE=edge')
		title React File Size
		meta(name='description', content='')
		meta(name='viewport', content='width=device-width, initial-scale=1')
		link(rel='stylesheet', href='//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css')
		link(rel='stylesheet', href='./index.min.css')
	body
		div(class='GithubButtons')
			a(href="https://twitter.com/share" class="twitter-share-button" data-via="elijahmanor") Tweet
			a(href="https://twitter.com/elijahmanor" class="twitter-follow-button" data-show-count="false") Follow @elijahmanor
			iframe(src="https://ghbtns.com/github-btn.html?user=elijahmanor&repo=react-file-size&type=star" frameborder="0" scrolling="0" width="51px" height="20px")
			iframe(src="https://ghbtns.com/github-btn.html?user=elijahmanor&repo=react-file-size&type=fork" frameborder="0" scrolling="0" width="53px" height="20px")
		script
			!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');
		h1 React File Size
		p
			a(href='https://facebook.github.io/react/') Facebook's React Library
			| &nbsp;is a very powerful and popular library these days.
			| This website's intent is to track the rise and fall of the size of the React library.&nbsp;
			a(href="#linechart_material") (see chart below)
		div(class='table-responsive')
			table(class='table table-striped table--fixed')
				thead
					tr
						th version
						th react.js
						th react.min.js
						th react-dom.js
						th react-dom.min.js
				tbody
					each version, i in combined
						- var previous = combined[ i - 1 ];
						tr
							td #{version.version}
							+ tableData(version.react, previous ? previous.react : null)
							+ tableData(version.reactMin, previous ? previous.reactMin : null)
							+ tableData(version.reactDom, previous ? previous.reactDom : null)
							+ tableData(version.reactDomMin, previous ? previous.reactDomMin : null)
		hr
		div(id="linechart_material")
		script(src='//cdnjs.cloudflare.com/ajax/libs/lodash.js/4.6.1/lodash.min.js')
		script(src='//www.gstatic.com/charts/loader.js')
		script(src='./index.min.js')
		script
			| (function(b,o,i,l,e,r){b.GoogleAnalyticsObject=l;b[l]||(b[l]=
			| function(){(b[l].q=b[l].q||[]).push(arguments)});b[l].l=+new Date;
			| e=o.createElement(i);r=o.getElementsByTagName(i)[0];
			| e.src='//www.google-analytics.com/analytics.js';
			| r.parentNode.insertBefore(e,r)}(window,document,'script','ga'));
			| ga('create','UA-62341839-1');ga('send','pageview');
		script(src="//static.getclicky.com/js")
		script try{ clicky.init(116099); }catch(e){}
